<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        /* div>p:last-child {
            color: red;
        } */

        /* div>p:nth-child(3) {
            color: red;
        } */

        /* div>p:nth-child(5) {
            color: red;
        } */

        /* 公式是 an+b */
        /* div>p:nth-child(-n+5) {
            color: red;
        } */

        /* 选中的是div的第一个儿子p元素（所有p类型的中计算的） */
        /* div>p:first-of-type {
            color: rebeccapurple;
        } */

        /* 选中的是div的最后一个儿子p元素（所有p类型的中计算的） */
        /* div>p:last-of-type {
            color: red;
        } */

        div>p:nth-of-type(3) {
            color: red;
        }
    </style>
</head>
<body>
    <!-- <div>
        <p>张三</p>
        <p>李四</p>
        <p>王五</p>
        <p>赵六</p>
        <p>孙七</p>
        <p>老八</p>
    </div> -->

    <!-- <div>
        <p>第1个</p>
        <p>第2个</p>
        <p>第3个</p>
        <p>第4个</p>
        <p>第5个</p>
        <p>第6个</p>
        <p>第7个</p>
        <p>第8个</p>
        <p>第9个</p>
        <p>第10个</p>
    </div> -->

    <div>
        <span>测试</span>
        <p>张三</p>
        <p>李四</p>
        <p>王五</p>
        <p>赵六</p>
        <p>孙七</p>
        <p>老八</p>
        <span>测试</span>
    </div>
</body>
</html>